<template>
  <div id="app">
    <router-view keep-alive></router-view>
  </div>
</template>

<script>
import Vue from "vue";
import { Notify, Toast } from "vant";
Vue.use(Notify);
export default {
  name: "app",
  created() {
    // Toast.loading({
    //   message: '定位中 请稍等...',
    //   forbidClick: true,
    //   duration: 0
    // });
    document.addEventListener("deviceready", this.onDeviceReady, false);
    this.getLocation();
  },
  methods: {
    //Cordova加载完成会触发
    onDeviceReady() {
    },
    getLocation() {
      const self = this;
      AMap.plugin("AMap.Geolocation", function () {
        var geolocation = new AMap.Geolocation({
          // 是否使用高精度定位，默认：true
          enableHighAccuracy: true,
          // 设置定位超时时间，默认：无穷大
          timeout: 10000,
          // 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
          buttonOffset: new AMap.Pixel(0, 0),
        });
        geolocation.getCurrentPosition();
        AMap.event.addListener(geolocation, "complete", onComplete);
        AMap.event.addListener(geolocation, "error", onError);
        function onComplete(data) {
          // data是具体的定位信息
          // console.log("具体的定位信息"+data);
          console.log("定位成功 精准定位",data);
          // Toast.success("定位成功 精准定位 当前所在" + data.city, data);
          self.$store.dispatch("setLocation", data);
          self.$store.dispatch("setAddress", data.formattedAddress);
        }

        function onError(data) {
          self.getLngLatLocation();
        }
      });
    },
    getLngLatLocation() {
      const self = this;
      AMap.plugin("AMap.CitySearch", function () {
        var citySearch = new AMap.CitySearch();
        citySearch.getLocalCity(function (status, result) {
          console.log("定位出错 非精准定位", result);
          // Toast.fail('定位出错 非精准定位 会有bug哦 当前所在'+ result.city);
          if (status === "complete" && result.info === "OK") {
            // 查询成功，result即为当前所在城市信息
            AMap.plugin("AMap.Geocoder", function () {
              var geocoder = new AMap.Geocoder({
                // city 指定进行编码查询的城市，支持传入城市名、adcode 和 citycode
                city: result.adcode,
              });

              var lnglat = result.rectangle.split(";")[0].split(",");

              geocoder.getAddress(lnglat, function (status, data) {
                if (status === "complete" && data.info === "OK") {
                  // result为对应的地理位置详细信息
                  // console.log(data);
                  self.$store.dispatch("setLocation", {
                    addressComponent: {
                      city: result.city,
                      province: result.province,
                    },
                    formattedAddress: data.regeocode.formattedAddress,
                  });

                  self.$store.dispatch(
                    "setAddress",
                    data.regeocode.formattedAddress
                  );
                }
              });
            });
          }
        });
      });
    },
  },
};
</script>

<style>
#app {
  width: 100%;
  height: 100%;
  font-size: 13px;
  letter-spacing: 0.1px;
  color: #333;
  background-color: #f6f6f6;
  font-family: "PHT_R";
}

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

/* 颜色 */
.red {
  color: #df5359;
}

/* 字体 */
.bold {
  font-weight: 700;
}

.font14 {
  font-size: 14px;
}

.font14c {
  font-size: 14px;
  color: #dba871;
  margin: 0 0.1rem;
}

.font12g {
  font-size: 12px;
  color: grey;
}

.font13g {
  color: gray;
}

.font14g {
  color: gray;
  font-size: 14px;
}

.font16g {
  color: gray;
  font-size: 16px;
}

.font16 {
  font-size: 16px;
}

.font18 {
  font-size: 18px !important;
}

.font20 {
  font-size: 20px !important;
}

.font22 {
  font-size: 22px !important;
}

.font18bold_c {
  font-size: 18px;
  font-weight: 900;
  margin: 0 0.1rem;
}

.font32 {
  font-size: 32px !important;
}

.font48 {
  font-size: 48px;
}

.font36h {
  font-size: 36px;
  color: #333;
  margin: 0 0.1rem;
}

.font24g {
  font-size: 24px;
  color: gray;
}

.font_gray11 {
  font-size: 11px;
  color: gray;
  margin-top: 0.1rem;
  min-height: 0.8rem;
}

.bold16 {
  font-weight: 600;
  /* color: black; */
  font-size: 16px;
}

.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.row-nowrap {
  display: flex;
  flex-direction: row;
}

.column {
  display: flex;
  flex-direction: column;
}

.center {
  align-items: center;
}

.between {
  justify-content: space-between;
}
</style>
